<!DOCTYPE html>
<!-- saved from url=(0026)https://daili.ele.me/agent -->
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>点吧外卖运营</title>
    <link href="/static/css/app.css" rel="stylesheet">
  	<link href="/static/css/barrager.css" rel="stylesheet">
    <script src="/static/js/layer.js"></script>
    <style type="text/css">
        .el-vue-amap-container,
        .el-vue-amap-container .el-vue-amap {
            height: 100%
        }
    </style>
    <style type="text/css">
        .el-vue-search-box-container {
            position: relative;
            width: 360px;
            height: 45px;
            background: #fff;
            box-shadow: 0 2px 2px rgba(0, 0, 0, .15);
            border-radius: 2px 3px 3px 2px;
            z-index: 10
        }

        .el-vue-search-box-container .search-box-wrapper {
            position: absolute;
            display: flex;
            align-items: center;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            box-sizing: border-box
        }

        .el-vue-search-box-container .search-box-wrapper input {
            flex: 1;
            height: 20px;
            line-height: 20px;
            letter-spacing: .5px;
            font-size: 14px;
            text-indent: 10px;
            box-sizing: border-box;
            border: none;
            outline: none
        }

        .el-vue-search-box-container .search-box-wrapper .search-btn {
            width: 45px;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            background: transparent;
            cursor: pointer
        }

        .el-vue-search-box-container .search-tips {
            position: absolute;
            top: 100%;
            border: 1px solid #dbdbdb;
            background: #fff;
            overflow: auto
        }

        .el-vue-search-box-container .search-tips ul {
            padding: 0;
            margin: 0
        }

        .el-vue-search-box-container .search-tips ul li {
            height: 40px;
            line-height: 40px;
            box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
            padding: 0 10px;
            cursor: pointer
        }

        .el-vue-search-box-container .search-tips ul li.autocomplete-selected {
            background: #eee
        }
    </style>
    <style type="text/css">
        .echarts {
            width: 600px;
            height: 400px;
        }
    </style>
</head>

<body>
    <div id="app" class="isInFrame">
        <div>
            <section class="page page-agent">
                <header class="page-header">
                    <h1>免费运营
                        <strong>预约表</strong>
                    </h1>
                </header>
                <div class="container">
                    <div>
                        <p class="info">
                            1、由于每周报名人数较多，且每周每个区只限5个名额，未能成功报名的商家可提前预约，没提前预约的商家，系统默认不能进行下周的报名。
                        </p>
                        <p class="info">
                            2、预约成功的商家，每周一早上10:00点准时开始报名。
                        </p>
                        <p class="info">
                            3、预约成功不代表报名成功，但预约可增大报名成功的几率。
                        </p>

                        <section class="steps-container">
                            <h2 class="steps-header">预约流程</h2>
                            <div class="steps">
                                <div class="el-row is-justify-space-around el-row--flex" algin="middle">
                                    <div class="el-col el-col-24">
                                        <div class="step step-1">
                                            <img src=""
                                                alt="">
                                        </div>
                                    </div>
                                    <div class="step-next el-col el-col-24">
                                        <img src=""
                                            alt="">
                                    </div>
                                    <div class="el-col el-col-24">
                                        <div class="step step-2">
                                            <img src=""
                                                alt="">
                                        </div>
                                    </div>
                                    <div class="step-next el-col el-col-24">
                                        <img src=""
                                            alt="">
                                    </div>
                                    <div class="el-col el-col-24">
                                        <div class="step step-3">
                                            <img src=""
                                                alt="">
                                        </div>
                                    </div>
                                </div>
                                <div class="step-desc el-row is-justify-space-around el-row--flex" algin="middle">
                                    <div class="el-col el-col-24">
                                        预约
                                    </div>
                                    <div class="el-col el-col-24"></div>
                                    <div class="el-col el-col-24">
                                        报名
                                    </div>
                                    <div class="el-col el-col-24"></div>
                                    <div class="el-col el-col-24">
                                        成功
                                    </div>
                                </div>
                            </div>
                        </section>
                        <div class="apply">

                            <form class="el-form el-form--label-top" action="add" method="post" name="addForm">
                                <!-- <div class="el-form-item is-required">
                              <label for="phone" class="el-form-item__label">手机号</label>
                              <div class="el-form-item__content">
                                <div class="el-row" style="margin-left: -10px; margin-right: -10px;">
                                  <div class="el-col el-col-14" style="padding-left: 10px; padding-right: 10px;">
                                    <div class="el-input">
                                      <input autocomplete="off" placeholder="请输入手机号" type="tel" rows="2" class="el-input__inner">
                                    </div>
                                  </div>
                                  <div class="el-col el-col-10" style="padding-left: 10px; padding-right: 10px;">
                                    <button type="button" class="el-button btn-block el-button--default">
                                      <span>发送验证码</span>
                                    </button>
                                  </div>
                                </div>
                              </div>
                            </div> -->
                                <div class="el-form-item is-required">
                                    <label for="smsCode" class="el-form-item__label">区域选择</label>
                                    <div class="el-form-item__content">
                                        <div class="el-input">
                                            <!-- <input autocomplete="off" placeholder="请输入验证码" type="text" rows="2" class="el-input__inner"> -->
                                            <select name="area" class="el-input__inner">
                                                <option value="晋安区">晋安区</option>
                                                <option value="鼓楼区">鼓楼区</option>
                                                <option value="台江区">台江区</option>
                                                <option value="仓山区">仓山区</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="el-form-item is-required">
                                    <label for="smsCode" class="el-form-item__label">店名</label>
                                    <div class="el-form-item__content">
                                        <div class="el-input">
                                            <input autocomplete="off" placeholder="请输入店名" type="text" rows="2" class="el-input__inner" name="shop">
                                        </div>
                                    </div>
                                </div>
                                <div class="el-form-item is-required">
                                    <label for="smsCode" class="el-form-item__label">美团外卖开店情况</label>
                                    <div class="el-form-item__content">
                                        <div class="el-input">
                                            <!-- <input autocomplete="off" placeholder="请输入验证码" type="text" rows="2" class="el-input__inner"> -->
                                            <select name="meituan" class="el-input__inner">
                                                <option value="未开店">未开店</option>
                                                <option value="开店0-5天">开店0-5天</option>
                                                <option value="开店5-10天">开店5-10天</option>
                                                <option value="开店10-15天">开店10-15天</option>
                                                <option value="开店15天以上">开店15天以上</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="el-form-item is-required">
                                    <label for="smsCode" class="el-form-item__label">饿了吗开店情况</label>
                                    <div class="el-form-item__content">
                                        <div class="el-input">
                                            <!-- <input autocomplete="off" placeholder="请输入验证码" type="text" rows="2" class="el-input__inner"> -->
                                            <select name="elema" class="el-input__inner">
                                                <option value="未开店">未开店</option>
                                                <option value="开店0-5天">开店0-5天</option>
                                                <option value="开店5-10天">开店5-10天</option>
                                                <option value="开店10-15天">开店10-15天</option>
                                                <option value="开店15天以上">开店15天以上</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="el-form-item is-required">
                                    <label for="smsCode" class="el-form-item__label">是否能更换营业执照</label>
                                    <div class="el-form-item__content">
                                        <div class="el-input">
                                            <!-- <input autocomplete="off" placeholder="请输入验证码" type="text" rows="2" class="el-input__inner"> -->
                                            <select name="changelic" class="el-input__inner">
                                                <option value="是">是</option>
                                                <option value="否">否</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="el-form-item is-required">
                                    <label for="smsCode" class="el-form-item__label">手机号</label>
                                    <div class="el-form-item__content">
                                        <div class="el-input">
                                            <input autocomplete="off" placeholder="请输入手机号" type="text" rows="2" class="el-input__inner" name="phone">
                                        </div>
                                    </div>
                                </div>
                                <div class="el-form-item is-required">
                                    <label for="smsCode" class="el-form-item__label">店铺品类</label>
                                    <div class="el-form-item__content">
                                        <div class="el-input">
                                            <input autocomplete="off" placeholder="如小炒、便当" type="text" rows="2" class="el-input__inner" name="style">
                                        </div>
                                    </div>
                                </div>
                                <div class="el-form-item">
                                    <div class="el-form-item__content">
                                        <button type="button" class="el-button btn-block el-button--primary" onclick="showTip()">
                                            <span>立即预约</span>
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <!-- <div class="el-dialog__wrapper" style="display: none;">
                      <div class="el-dialog el-dialog--mini" style="top: 15%;">
                        <div class="el-dialog__header">
                          <span class="el-dialog__title">输入验证码</span>
                          <button type="button" aria-label="Close" class="el-dialog__headerbtn">
                            <i class="el-dialog__close el-icon el-icon-close"></i>
                          </button>
                        </div>
                      </div>
                    </div> -->
                    </div>
                </div>
            </section>
        </div>
		
    </div>
</body>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="/static/js/jquery.barrager.min.js"></script>
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.js"></script>
<script>
  	var barData = [
    	{'img':'/img/001.jpg','info':'莆***卤面预约成功!'},
		{'img':'/img/002.jpg','info':'虾***简餐预约成功!'},
		{'img':'/img/003.jpg','info':'客***小炒店预约成功!'},
		{'img':'/img/004.jpg','info':'北***牛肉饭预约成功!'},
		{'img':'/img/005.jpg','info':'秘***烤肉店预约成功!'},
		{'img':'/img/006.jpg','info':'林记***中式预约成功!'},
		{'img':'/img/007.jpg','info':'鲜***蛋包饭预约成功!'},
		{'img':'/img/008.jpg','info':'老***烧烤店预约成功!'},
		{'img':'/img/009.jpg','info':'芊***麻辣烫约成功!'},
		{'img':'/img/010.jpg','info':'上海***老鸭馆店预约成功!'},
		{'img':'/img/011.jpg','info':'121***蟹煲饭预约成功!'},
		{'img':'/img/012.jpg','info':'辛***鱼粉店预约成功!'},
		{'img':'/img/013.jpg','info':'有家***便当预约成功!'},
		{'img':'/img/014.jpg','info':'味***小炒预约成功!'},
    	{'img':'/img/001.jpg','info':'莆***卤面预约成功!'},
		{'img':'/img/002.jpg','info':'虾***简餐预约成功!'},
		{'img':'/img/003.jpg','info':'客***小炒店预约成功!'},
		{'img':'/img/004.jpg','info':'北***牛肉饭预约成功!'},
		{'img':'/img/005.jpg','info':'秘***烤肉店预约成功!'},
		{'img':'/img/006.jpg','info':'林记***中式预约成功!'},
		{'img':'/img/007.jpg','info':'鲜***蛋包饭预约成功!'},
		{'img':'/img/008.jpg','info':'老***烧烤店预约成功!'},
		{'img':'/img/009.jpg','info':'芊***麻辣烫约成功!'},
		{'img':'/img/010.jpg','info':'上海***老鸭馆店预约成功!'},
		{'img':'/img/011.jpg','info':'121***蟹煲饭预约成功!'},
		{'img':'/img/012.jpg','info':'辛***鱼粉店预约成功!'},
		{'img':'/img/013.jpg','info':'有家***便当预约成功!'},
		{'img':'/img/014.jpg','info':'味***小炒预约成功!'},
    ]
	$(document).ready(function(){
      var data = barData;
      //每条弹幕发送间隔
      var looper_time=3*1000;
      var items=data;
      //弹幕总数
      var total=data.length;
      //是否首次执行
      var run_once=true;
      //弹幕索引
      var index=0;
      //先执行一次
      barrager();
      function  barrager(){


        if(run_once){
            //如果是首次执行,则设置一个定时器,并且把首次执行置为false
            looper=setInterval(barrager,looper_time);                
            run_once=false;
        }
        //发布一个弹幕
        $('body').barrager(items[index]);
        //索引自增
        index++;
        //所有弹幕发布完毕，清除计时器。
        if(index == total){

            clearInterval(looper);
            return false;
        }




      }
      
    });
</script>
<script>
    function getForm() {
        var area = document.addForm.area.value;
        var shop = document.addForm.shop.value;
        var phone = document.addForm.phone.value;
        var meituan = document.addForm.meituan.value;
        var elema = document.addForm.elema.value;
        var changelic = document.addForm.changelic.value;
        var style = document.addForm.style.value;
        var result = checkData(phone);
        if(!result){
            return false;
        }
        var data = {
            area: area,
            shop: shop,
            phone: phone,
            meituan: meituan,
            elema: elema,
            changelic: changelic,
            style: style
        }
        return data;
    }
    function checkData(phone){
        if(!(/^1[3456789]\d{9}$/.test(phone))){ 
            layer.open({
                content: '电话号码有误',
                btn: '我知道了'
            });  
            return false; 
        }else{
            return true;
        }
    }
    function showTip() {
        var data = getForm();
        if(!data){
            return false;
        }
        axios.post('http://dbkj.lgycloud.com/addorder', data)
            .then(res => {
                if (res.data.result == 1) {
                    layer.open({
                        content: '预约成功,每周一10点准时开放报名名额喔'
                        , btn: '我知道了'
                    });
                } else {
                    layer.open({
                        content: '预约失败',
                        btn: '立即重试',
                        yes: function (index) {
                            //                    window.location.href = 'http://dbkj.lgycloud.com/order';
                            layer.close(index);
                        }
                    });
                }

            })
            .catch(res => {

            })

    }
</script>

</html>